<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>登录</title>
		<meta name="description" content="particles.js is a lightweight JavaScript library for creating particles.">
		<meta name="author" content="Vincent Garreau" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<link rel="stylesheet" media="screen" th:href="@{/css/style.css}">
		<link rel="stylesheet" type="text/css" th:href="@{/css/reset.css}" />
		<link rel="stylesheet" th:href="@{/css/sa.css}">
		<style type="text/css">
			/* 背景图片 */
			#particles-js{
				background-image: url(./depot/bg.jpg);
			}
			/* ajax2加载时的转圈圈样式 */
			.ajax-layer-load{background-color: rgba(0,0,0,0.7) !important; color: #FFF !important;}
			
			/* 样式调整 */
			.login-box{display: flex; justify-content: center; align-items: center; position: fixed; width: inherit; height: 100%; pointer-events: none;}
			.login{height: auto; padding: 50px 30px; position: static; margin: 0 auto !important; pointer-events: all;}
			.login-top{margin-top: 0px; margin-bottom: 30px;}
			.logo-img{width: 50px; height: 50px; vertical-align: middle; position: relative; top: -3px; border-radius: 50%; margin-left: -10px; margin-right: 10px;}
			.logo-img{display: none;}
			.login-button{width: 270px;}
			/* .page-title{line-height: 50px;} */
			
			.sk-rotating-plane{}
			
		</style>
	</head>
	<body>
		<div id="particles-js">
			<div class="login-box">
				<form id="fr" th:action="@{/login}" method="post">
					<div class="login">
						<div class="login-top">
							<img src="" class="logo-img" alt="">
							<span class="page-title">登录</span>
						</div>
						<div class="login-center clearfix">
							<div class="login-center-img"><img th:src="@{/depot/name.png}" /></div>
							<div class="login-center-input">
								<input type="text" name="username" value="" placeholder="请输入账号" />
								<div class="login-center-input-text">账号</div>
							</div>
						</div>
						<div class="login-center clearfix">
							<div class="login-center-img"><img th:src="@{/depot/password.png}" /></div>
							<div class="login-center-input">
								<input type="password" name="password" value="" placeholder="请输入密码" />
								<div class="login-center-input-text">密码</div>
							</div>
						</div>
						<div class="login-button">登陆</div>
						<br>
					</div>
				</form>
			</div>
			<div class="sk-rotating-plane"></div>
		</div>

		<!-- scripts -->
		<script th:src="@{/js/particles.min.js}"></script>
		<script th:src="@{/js/app.js}"></script>
		<script th:src="@{/js/appactions.js}"></script>
		<script src="https://unpkg.com/jquery@3.4.1/dist/jquery.min.js"></script>
		<script src="https://www.layuicdn.com/layer-v3.1.1/layer.js"></script>
		<script th:src="@{/js/sa.js}"></script>
		<script type="text/javascript">
			if(new acquire().parameterMap['is']=='no'){
				alert("当前系统已被锁定");
			}
			// 你所有要改的代码全在这里   ↓↓↓↓↓ 
			
			// 所有参考属性  
			var page_title = '[[${System_Title}]]';		// 页面标题
			var key = '';						// 默认的key
			var password = '';					// 默认的password
			var logo_url = './depot/admin-logo.png';	// logo地址，为空字符串则不显示
			
			// 点击登录按钮 
			document.querySelector(".login-button").onclick = function() {
				/*// 1、取值
				var p = {
					key: $('[name=key]').val(),
					password: $('[name=password]').val()
				}
				// 2、判断
				if(p.key == '' || p.password == ''){
					return layer.msg('请输入任意内容即可');
				}
				// 3、请求后台
				sa.ajax2('/acc/doLogin', p, function(res) {
					sa.msg('登录成功，欢迎你：' + p.key);
					setTimeout(function () {
						if(parent == window){
							location.href = "index.html";
						}else{
							sa.closeCurrIframe();
							parent.location.reload();
						}
					}, 500);
				})*/
				$("#fr").submit();
			}
			// 你所有要改的代码全在这里   ↑↑↑↑↑	
			
		</script>
		<script type="text/javascript">
			// 替换属性 
			$('.page-title').html(page_title);
			$('title').html(page_title);
			$('[name=key]').val(key);
			$('[name=password]').val(password);
			if(logo_url != null && logo_url != '') {
				$('.logo-img').attr('src', logo_url);
				$('.logo-img').show();
			}
			// 绑定回车事件
			$('[name=password]').bind('keypress', function(event){
				if(event.keyCode == "13") {
					$('.login-button').click();
				}
			});
		</script>
	</body>
</html>
